.TipTapEditor {
    border: 1px solid var(--color-border);
    background-color: var(--bg-space-color);
    border-radius: 4px;
    overflow: hidden;
    overflow: auto;

    padding: 0 12px;

    .menuList {
        position: sticky;
        top: 0px;
        left: 0px;
        padding-top: 12px;
        z-index: 999;
        background-color: var(--bg-space-color);
    }

    .btnsBox {
        position: relative;

        .btnsList {
            overflow: hidden;
            position: absolute;
            top: 21px;
            left: 0px;
            z-index: 999;
            border: 0px solid var(--color-border);
            background: var(--bg-level3-color);
            min-width: 130px;
            padding: 10px;
            border-radius: 4px;
            transition: all 0.3s;
            display: none;
        }

        .is-btn-active {
            background-color: var(--bg-active-color);
        }
    }

    .btnsBox:hover {
        .btnsList {
            display: block;
            border: 1px solid var(--color-border);
        }
    }

    .alignmentBox {
        position: relative;

        .btnsList {
            border: 0px solid var(--color-border);
            background: var(--bg-level3-color);
            border-radius: 4px;
            padding: 10px;
            border: 1px solid var(--color-border);

            margin-top: 5px;
        }
    }

    .ant-btn-default {
        // border: none;
        background: none;
        min-width: 25px;
        height: 25px;
        font-size: 16px;
        padding: 5px;
        text-align: center;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        margin-right: 5px;
    }

    .ant-typography,
    .ant-typography+h1.ant-typography,
    .ant-typography+h2.ant-typography,
    .ant-typography+h3.ant-typography,
    .ant-typography+h4.ant-typography,
    .ant-typography+h5.ant-typography {
        margin: 0px;
        padding: 5px 5px;
        cursor: pointer;
        border-radius: 4px;
    }

    .tiptap {
        -webkit-box-shadow: none;
        font-size: 16px;
        min-height: 350px;

        >*+* {
            margin-top: 0.75em;
        }

        ul,
        ol {
            padding: 0 1.1rem;
        }

        h1,
        h2,
        h3,
        h4,
        h5,
        h6 {
            line-height: 1.1;
        }


        pre {
            background: rgb(64, 64, 64);
            color: #FFF;
            font-family: 'JetBrainsMono', monospace;
            padding: 0.75rem 1rem;
            border-radius: 0.5rem;

            code {
                color: inherit;
                padding: 0;
                background: none;
                font-size: 0.8rem;
            }
            // .hljs-comment,
            //     .hljs-quote {
            //         color: #616161;
            //     }
    
            //     .hljs-variable,
            //     .hljs-template-variable,
            //     .hljs-attribute,
            //     .hljs-tag,
            //     .hljs-name,
            //     .hljs-regexp,
            //     .hljs-link,
            //     .hljs-name,
            //     .hljs-selector-id,
            //     .hljs-selector-class {
            //         color: #f98181;
            //     }
    
            //     .hljs-number,
            //     .hljs-meta,
            //     .hljs-built_in,
            //     .hljs-builtin-name,
            //     .hljs-literal,
            //     .hljs-type,
            //     .hljs-params {
            //         color: #fbbc88;
            //     }
    
            //     .hljs-string,
            //     .hljs-symbol,
            //     .hljs-bullet {
            //         color: #b9f18d;
            //     }
    
            //     .hljs-title,
            //     .hljs-section {
            //         color: #faf594;
            //     }
    
            //     .hljs-keyword,
            //     .hljs-selector-tag {
            //         color: #70cff8;
            //     }
    
            //     .hljs-emphasis {
            //         font-style: italic;
            //     }
    
            //     .hljs-strong {
            //         font-weight: 700;
            //     }
           
        }

        img {
            max-width: 100%;
            height: auto;
        }

        blockquote {
            padding-left: 1rem;
            border-left: 2px solid rgba(#0D0D0D, 0.1);
        }

        hr {
            border: none;
            border-top: 2px solid rgba(#0D0D0D, 0.1);
            margin: 1.5rem 0;
        }

        hr.ProseMirror-selectednode {
            border-top: 1px solid #68cef8;
        }
    }


    .ProseMirror-focused {
        outline: none;
    }
}
// .ProseMirror {
    
  
//     > * + * {
//       margin-top: 0.75em;
//     }
//   }